import {
  parseHtmlToAST
} from './astParser';
import {
  generate
} from './generate';

function compileToRenderFunction(html) {
  // console.log(html);
  //打印html字符串模板

  //将html转化成AST
  const ast = parseHtmlToAST(html),
    //根据AST树数据生成 字符串代码
    code = generate(ast),

    /**
     * console.log(code);
     * _c('div',{id:"app"style:{"color":" red"," font-size":" 20px"},_v("hello "+_s(name)+" 欢迎光临"),
      _c('span',{class:"text"style:{"color":"green"},_v(_s(age))
      )
    ,
      _c('p',undefined,_v("hello vue")
      )
    
      )
     */

    //生成render函数
    //with(obj)相当于将obj写法 省略this写法
    //var obj ={a: 1, b: 2}
    //with(obj){ console.log(a, b, a + b); } 1 2 3
    //将新实例的函数内部的作用域this抛出
    //这样，可以实现外部访问code里面的属性时不用写this.name/this.age..
    render = new Function(`with(this){ return ${code} }`);

  /**
   * console.log(render);
   * ƒ anonymous() {
   *   with(this){ return
   *     _c('div',{id:"app",style:{"color":" red"," font-size":" 20px"}},_v("hello "+_s(name)+" 欢迎光临"),
   *     _c('span',{class:"text",style:{"color":"green"}},_v(_s(age))
   *     …
   * }
   */

  return render;

}

export {
  compileToRenderFunction
}